import React from 'react';
import MyTitle from '../../../component/System settings/MyTitle'
import { message } from 'antd';
import { useNavigate } from 'react-router-dom';
import '../../../styles/System settings/Changepassword.scss'
import { Button, Checkbox, Form, Input } from 'antd';
import { patient_changepassword } from '../../../utils/System settings/api'

interface Props {

}
function Changepassword(props: Props) {
    let navigate = useNavigate()
    // 保存
    const onFinish = (values: any) => {
        let userid = localStorage.getItem('userid')
        let userinfo = JSON.parse(localStorage.getItem('userinfo') || '0')
        userinfo.pass = values.password
        userinfo.repass = values.repassword
        let infomession: any = {}

        infomession.token = localStorage.getItem('token')
        infomession.userinfo = userinfo

        console.log('infomession', infomession)
        patient_changepassword(userid, infomession).then((res) => {
            console.log(res.data)
            message.warning('密码已修改，请重新登录！')
            navigate('/login')
            localStorage.removeItem('token')
            localStorage.removeItem('userinfo')
        })
    };

    const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
    };


    return (
        <div className='passboder'>
            <MyTitle title={'修改密码'} />
            <div className="passbox">
                <div className="addtitle">
                    修改密码
                </div>
                <div className="pass">
                    <Form
                        name="basic"
                        labelCol={{ span: 8 }}
                        wrapperCol={{ span: 16 }}
                        initialValues={{ remember: true }}
                        onFinish={onFinish}
                        onFinishFailed={onFinishFailed}
                        autoComplete="off"
                    >
                        <Form.Item
                            label="新密码"
                            name="password"
                            rules={[{ required: true, message: '请输入内容!', pattern: /^.{1,11}$/ }]}
                        >
                            <Input />
                        </Form.Item>

                        <Form.Item
                            label="密码确认"
                            name="repassword"
                            rules={[
                                ({ getFieldValue }) => ({
                                    validator(rule, value) {

                                        if (!value || getFieldValue('password') === value) {
                                            return Promise.resolve();
                                        }
                                        return Promise.reject('新密码与确认新密码不同！');
                                    }
                                })
                            ]}
                        >
                            <Input />
                        </Form.Item>

                        <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                            <Button type="primary" htmlType="submit" style={{ marginTop: 20, width: 100 }}>
                                保存
                            </Button>
                        </Form.Item>
                    </Form>
                </div>
            </div>
        </div>
    );
}

export default Changepassword;